<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>GPT口语训练师</title>
    <link rel="stylesheet" href="css/home.css">
    <link rel="stylesheet" href="css/login.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
        <!--看板娘 -自定义大小，隐藏对话框和对话框高度-->
<style type="text/css">   
    #waifu #live2d {       
          height: 300px!important;        
          width: 300px!important;   
    }
    #waifu-tips {        
                top: -60px;
                /*display:none !important; #隐藏对话框*/
                }</style>
     <!--看板娘加载指定模型-->
     
     <script>
             localStorage.setItem('modelId', '2');  
             localStorage.setItem('modelTexturesId', '3');
     </script>
     
     <!--配置看板娘左右位置-->
     
     <script src="https://api.itggg.cn/live2dnew/left/index.js"> </script>
</head>
<body>
<div class="loginbody">
<div class="fixed" id="content">
    <div class="form-demo">
        <!-- 旋转开关 -->
        <div class="switch"><h2>没有/已有账号？</h2></div>
        <input type="checkbox" style="display: none;" id="change">
        <label for="change">切 换</label>

        <div class="turn">
            <div class="over">
                <form action="" class="login">
                    <h1>登 录</h1>
                    <input type="text" id="username" placeholder="用户名">
                    <input type="password" id="password" placeholder="密码">
                    <input type="button" class="btn" onclick="getuser()" value="登 录">
                </form>
                <form action="" class="sign">
                    <h1>注 册</h1>
                    <input type="text" id="user0" placeholder="用户名">
                    <input type="password" id="password0" placeholder="密码">
                    <input type="password" id="password1" placeholder="确认密码">
                    <input type="button" id="zc" class="btn" value="注 册">
                </form>
            </div>
        </div>
    </div>
</div>
<div class="container" id="container">
    <div class="sidebar">
            <h2>GPT口语训练</h2>
        <div class="functions" id="functions">
            <button id="a">自由模式</button>
            <button id="b">情景模式</button>
            <button id="c">模拟训练</button>
            <button class="btn-small" id="d">用户中心</button>
        </div>

        <div class="notifications">
            <p>公告：这是一条通知信息。</p>
        </div>
    </div>
    <div class="chatbox">
<!--        这是工具栏部分-->
        <div class="toolbar">
            <div class="dropdown">
                <select id="fenlei">
                    <option value="option2">Option 2</option>
                    <option value="option3">Option 3</option>
                </select>
            </div>
            <div class="dropdown">
                <select id="wenz">
                    <option value="option1">Option 1</option>
                    <option value="option2">Option 2</option>
                    <option value="option3">Option 3</option>
                </select>
            </div>
            <div class="dropdown">
                <button id="begain_qing" class="buttons">开始</button>
            </div>

            <h1 id="moshi">情景模式</h1>
            <div class="spacer"></div>
            <button><i class="fa fa-plus"></i></button>
            <button><i class="fa fa-edit"></i></button>
            <button><i class="fa fa-trash"></i></button>
        </div>
        <div class="chatlog" id="msg-div">
        </div>
        <div class="chat-input">
            <input type="text" placeholder="Type your message..." id="inputTxt">
            <div class="buttons">
                <button class="send-btn" id="send">发送</button>
                <button class="voice-btn" id="startButton">语音输入</button>
            </div>
        </div>
    </div>
</div>
</div>
</body>
     <script type="text/javascript" src="js/ws.js"></script>
        <script type="text/javascript" src="js/main.js"></script>
        <script type="text/javascript" src="js/audio.js"></script>
</html>